﻿<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<!-- 删除默认的苹果工具栏和菜单栏 ： 即启用 WebApp 全屏模式  -->
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<!-- 在web app应用下状态条（屏幕顶部条）的颜色；默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）若值为“black-translucent”将会占据页面px位置，浮在页面上方（会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px）。 -->
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<!-- 忽略数字自动识别为电话号码 ,忽略识别邮箱 -->
		<meta name="format-detection" content="telephone=no, email=no" />
		<!-- 启用360浏览器的极速模式(webkit) -->
		<meta name="renderer" content="webkit">
		<!-- 避免IE使用兼容模式 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!-- uc强制竖屏 -->
		<meta name="screen-orientation" content="portrait" />
		<!-- QQ强制竖屏 -->
		<meta name="x5-orientation" content="portrait">
		<!-- UC强制全屏 -->
		<meta name="full-screen" content="true" />
		<!-- QQ强制全屏 -->
		<meta name="x5-fullscreen" content="true" />
		<!-- 360强制全屏 -->
		<meta name="360-fullscreen" content="true" />
		<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>
		<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css">
		<style>
			.all {
				width: 100%;
			}
			
			.top {
				background-color:#ffffff;
				height: 1.4rem;
				border-bottom: 0.05rem solid #f1f2f2;
			    vertical-align: middle;
			}
			
			.card1-1 {
				margin-top:-0.8rem;
				padding-left: 0.3rem;
				padding-bottom: 0.5rem;
				marigin-left:0.4rem;
				border-bottom: 0.05rem solid #f1f2f2;
				margin-top:-0.3rem;
			}
			
			.h1 {
				font-size: 0.5rem;
				font-weight: 600;
				color: #242424;
				margin-top: 0.5rem;
			}
			
			.h2 {
				color: #9c9c9c;
				margin-top: 0.23rem;
				font-size: 0.32rem;
				font-weight: 600;
			}
			
			.clearfix:after {
				display: table;
				content: "";
				clear: both;
			}
			
			.card1-3 {
				margin-bottom: -0.2rem;
				position: relative;
				margin-top:0.6rem;
				padding: 0.05rem;
			}
			
			.f1 {
				float: left;
				color: #ff772d;
				font-size: 0.45rem;
				padding-bottom: -2rem;
				padding-top: 0.1rem;
			}
			
			.f2 {
				float: right;
				color: #9c9c9c;
				font-size: 0.32rem;
				position: absolute;
				top: 0.25rem;
				left: 5rem;
			}
			
			.f2 span {
				color: #ff772d;
				font-size: 0.32rem;
			}
			
			.card1-2 {
				margin-top: 0.4rem;
				padding-left: 0.3rem;
				padding-bottom: 0.4rem;
				border-bottom: 0.25rem solid #f1f2f2;
				vertical-align: middle;
			}
			
			.f3 {
				float: left;
				height: 0.6rem;
				line-height: 0.6rem;
			}
			
			.f4 {
				padding-left: 0.1rem;
				float: left;
				height: 0.6rem;
				line-height: 0.6rem;
				color: #9c9c9c;
			}
			
			.card2-1 {
				padding: 0.3rem;
				font-size: 0.45rem;
				border-bottom: 0.05rem solid #f1f2f2;
				color: #242424;
			}
			
			.card2-2 {
				font-size: 0.45rem;
				border-bottom: 0.05rem solid #f1f2f2;
			}
			
			.c1 {
				padding: 0.3rem;
				color: #575757;
			}
			
			.c2 {
				padding-left: 0.7rem;
				padding-bottom: 0.35rem;
				color: #9c9c9c;
			}
			
			.card2-3 {
				border-bottom: 0.3rem solid #f1f2f2;
			}
			
			.c3 {
				padding: 0.3rem;
				color: #9c9c9c;
				font-size: 0.45rem;
			}
			
			.card3-1 {
				float: left;
				background: #ffffff;
				height: 1.5rem;
				line-height: 0.5rem;
				width: 40%;
				
			}
			.fl{
				float:left;
				padding-left:0.8rem;
				margin-top:0.25rem;
			}
			.h6{
				font-size:0.3rem;
				color:3d3d3d;
				vertical-align: middle;
			}
			.card3-2 {
				float: left;
				background-color: #ffb122;
				width: 30%;
				height: 1.5rem;
				line-height: 1.5rem;
				text-align: center;
				color: #ffffff;
				font-size: 0.45rem;
			}
			
			.card3-3 {
				float: left;
				background-color: #ff7400;
				height: 1.5rem;
				line-height: 1.5rem;
				width: 30%;
				color: #ffffff;
				text-align: center;
				font-size: 0.45rem;
				width: 30%;
			}
			
		</style>
	</head>

	<body>
		<div class="all">
			<div class="top clearfix">
			<span class="fa fa-angle-left" style="font-size:1.1rem;color: #9c9c9c;float:left;margin:0.2rem;"></span>
			</div>
			<div class="card1">
				<div class="card1-1">
					<div class="h1">高考英语速成2班</div>
					<div class="h2">1月24日-2月1日 共8次课</div>
					<div class="h2">英语|适合高中所有版本素材</div>

					<div class="card1-3 clearfix">
						<div class="f1 a">￥282</div>
						<div class="f2">班主任：李彤|剩余名额：<span>6</span></div>
					</div>
				</div>

				<div class="card1-2 clearfix">
					<img class="f3" src="imges/logo3.png" />
					<div class="f4">寒假组团报名可享受8折优惠，赠送精美礼品</div>
					<i class="fa fa-angle-right"style="font-size:0.4rem;height: 0.6rem;
				line-height: 0.6rem;padding-right:0.3rem;float:right;"></i>
				</div>
			</div>
			<div class="card2">
				<div class="card2-1">课程大纲（8次课）</div>

				<div class="card2-2">
					<div class="c1">1 单项选择技巧:技巧课</div>
					<div class="c2">1月24日 周三 8：30-10：30 董明雨</div>
				</div>
				<div class="card2-2">
					<div class="c1">2 阅读理解速成:强化提升课</div>
					<div class="c2">1月25日 周四 8：30-10：30 董明雨</div>
				</div>
				<div class="card2-2">
					<div class="c1">3 写作能力提升:方法课</div>
					<div class="c2">1月26日 周五 8：30-10：30 董明雨</div>
				</div>
				<div class="card2-3">
					<div class="c3">查看所有课程体系</div>
				</div>
			</div>
			<div class="card3 clearfix">
				<div class="card3-1 clearfix">
					<div class="fl">
						<li class="fa fa-commenting-o"style="font-size:0.7rem;color:#666666";></li>
						<div class="h6">咨询</div>
					</div>
					<div class="fl">
						<i class="fa fa-cart-arrow-down"style="font-size:0.7rem;color:#666666";></i>
						<p class="h6">选课单</p>
					</div>
				</div>
				<div class="card3-2">
					<span>加入购物车</span>
				</div>
				<div class="card3-3">
					<span>立即购买</span>
				</div>

			</div>
		</div>
		<script src="js/jquery-3.2.1.js"></script>
		<script>
			$(start);
			function start(){
				$(".all>div:eq(0)>span").click(
					function(){
						history.go(-1);
					}
				)
			}
		</script>
	</body>

</html>